<!--<form class="form-horizontal form-validate form-modal" method="post" action="{:url('RegionInfo')}" id="app">-->


    <div class="form-horizontal form-validate form-modal" id="app">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4 class="modal-title">修改代理商身份</h4>
                </div>
                <div class="modal-body">
                    <div class="form-group m-t-md">
                            <label class="control-label">代理身份：</label>
                            <div >
                                <select class="control-label" name="type" data-rule-required="true" @change="changeOp">
                                    <option value="1" {$data['type']==1?'selected':''} >省代理</option>
                                    <option value="2" {$data['type']==2?'selected':''} >市代理</option>
                                    <option value="3" {$data['type']==3?'selected':''} >区代理</option>
                                    <option value="4" {$data['type']==4?'selected':''} >镇代理</option>
                                </select>
                            </div>
                      </div>
    
                    <div class="form-group m-t-md">
                        <label class="control-label">代理区域：</label>
                        <div>
                           <el-cascader  v-model="cascader" :key="refreshItem" ref="myCascader" :props="props" style="width: 300px"></el-cascader>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <input type="hidden" value="{$user_id}" name="user_id" />
                    <button type="submit" class="btn btn-primary" data-loading-text="保存中..." @click="submitForm">保存</button>
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                </div>
            </div>
        </div>
    </div>
    <script src="__STATIC__/js/jquery/jquery/1.8.3/jquery.min.js"></script>
    <script src="__STATIC__/js/layer/layer.js"></script>
    <script src="__STATIC__/js/jquery/jquery.form.min.js"></script>


        <!-- import Vue before Element -->
    <script src="__STATIC__/vue/vue.js"></script>
    <!-- import JavaScript -->
    <script src="__STATIC__/vue/index.js"></script>
    <link rel="stylesheet" href="__STATIC__/vue/index.css">
    
    <script type="text/javascript">
        var regionname = "{$data['province_name']}"+"{$data['city_name']}"+"{$data['district_name']}"+"{$data['street_name']}"
        console.log(regionname)
        var app 
        $(function () {setTimeout(()=>{
            app = new Vue({
              el: '#app',
              data: {
                cascader: [],
                refreshItem: 0,
                props: {
                  lazy: true,
                  lazyLoad: ((node, resolve) => {
                    const { level } = node;
                    const params = { selected: Number(level) + 1 }
                    if ( level != 0 ) { params['parent_id'] = node.value }
                    jq_ajax('{:url("member/api.address/getRegion")}',params,function (res) {
                      const nodes = res.data.map(item => ({
                          value: item.code,
                          label: item.name,
                          leaf:  $('select[name="type"]').find('option:selected').val() == Number(level) + 1
                      }));
                      resolve(nodes);
                    })
                  })
                }
              },
              methods: {
                changeOp() {
                    this.refreshItem++;
                },
                submitForm() {
                    const params = {
                        type: $('select[name="type"]').find('option:selected').val(),
                        province_id: this.cascader[0] ? this.cascader[0] : 0,
                        city_id: this.cascader[1] ? this.cascader[1] : 0,
                        district_id: this.cascader[2] ? this.cascader[2] : 0,
                        street_id: this.cascader[3] ? this.cascader[3] : 0,
                        user_id: '{$user_id}'
                    }
                    jq_ajax('{:url("RegionInfo")}',params,function (res) {
                        if (res.code == 0) {
                            _alert(res.msg);
                            return false;
                        }
                        _alert(res.msg,'{:url("member/center/index")}');
                    })
                }
              }
            })  
        },0)})
    
    
    
    
    
    
    
        /**
         * 获取城市
         * @param t  省份select对象
         */
        function get_city(t){
            // $('#city').css('display','block');
            var arr = new Object();
            arr.parent_id = $(t).val();
            if(!arr.parent_id > 0){
                return;
            }
            $('#district').empty().css('display','none');
            $('#twon').empty().css('display','none');
            $("#city").find("option").remove();
            jq_ajax('{:url("sys_admin.users/getRegion")}',arr,function(v){
                v = '<option value="0">选择城市</option>'+ v;
                // $('#city').empty().html(v);
                $("#city").append(v);
            });
        }
    
        /**
         * 获取地区
         * @param t  城市select对象
         */
        function get_area(t){
            var arr = new Object();
            arr.parent_id = $(t).val();
            if(!arr.parent_id > 0){
                return;
            }
            $('#district').empty().css('display','inline');
            $('#twon').empty().css('display','none');
            $("#district").find("option").remove();
            jq_ajax('{:url("sys_admin.users/getRegion")}',arr,function(v){
                v = '<option value="0">选择城市</option>'+ v;
                $('#district').empty().html(v);
                // $("#district").append(v);
            });
        }
    
        $('.editpwd').on('click',function(){
            console.log('点击')
            var arr = new Object();
            arr.province_id = $('select[name="province_id"]').find('option:selected').val();
            arr.city_id = $('select[name="city_id"]').find('option:selected').val();
            arr.district_id = $('select[name="district_id"]').find('option:selected').val();
            arr.name =  $('input[name="name"]').val();
            arr.phone =  $('input[name="phone"]').val();
            arr.type =  $('select[name="type"]').find('option:selected').val();
            arr.region_address =  $('input[name="region_address"]').val();
            console.log('点击',arr);
            if(arr.name==''){
                _alert('请输入姓名.');
                return false;
            }
    
            if(arr.phone==''){
                _alert('请输入手机号.');
                return false;
            }
    
            if(arr.province_id==0 || arr.province_id==100000){
                _alert('请选择省份.');
                return false;
            }
    
            if(arr.type == 2 || arr.province_id==100000){
                if(arr.city_id==0){
                    _alert('请选择城市.');
                    return false;
                }
            }
    
            if(arr.type == 1){
                if(arr.district_id==0){
                    _alert('请选择区域.');
                    return false;
                }
            }
    
    
            if(arr.region_address==''){
                _alert('请输入详细地址.');
                return false;
            }
            // if(!checkMobile(pickup_phone))
            //error += '手机号码格式有误 <br/>';
    
    
            jq_ajax('{:url("add_user_region")}',arr,function (res) {
                // console.log(res);
                if (res.code == 0) {
                    _alert(res.msg);
                    return false;
                }
                _alert(res.msg,'{:url("member/center/index")}');
            })
        })
    </script>
    
    